<template>
	<view class="content">
		<u-navbar class="head-index" :fixed="false" :safeAreaInsetTop="true" bgColor="#51d0d0" titleStyle="color:#fff"
			:autoBack="true" leftIconColor="#fff" title="设置"></u-navbar>

		<view class="CellBox">

			<u-cell-group :border="false">
				<u-cell :border="false" title="清理缓存" @click="clear">
					<view slot="value" class="x-f">
						<text style="color: #da1616;font-size: 13px;">{{fileSizeString}}</text>
						<uni-icons v-show="fileSizeString" color="#da1616" type="trash" size="18"></uni-icons>
					</view>
				</u-cell>
				<u-cell :border="false" title="安全设置" @click="ToticketPage"></u-cell>
			</u-cell-group>


			<u-cell-group :border="false" style="margin-top: 20px;">
				<u-cell :border="false" title="系统权限" @click="OpenManage"></u-cell>
				<u-cell @click="openWebInBrowser(1)" :border="false" title="用户隐私协议"></u-cell>
				<u-cell @click="openWebInBrowser(2)" :border="false" title="用户隐私政策"></u-cell>
				<!-- <u-cell :border="false" title="关于我们"></u-cell>
				<u-cell :border="false" title="反馈与建议"></u-cell> -->
			</u-cell-group>


			<u-cell-group :border="false" style="margin-top: 20px;">
				<u-cell :border="false" title="版本介绍">
					<view slot="value">
						<text style="color: #999;font-size: 13px;">当前版本：{{version}}</text>
					</view>
				</u-cell>
				<u-cell :border="false" title="检查更新" @click="GetUpdate"></u-cell>
			</u-cell-group>

			<!-- 退出登录 -->
			<view class="LoginOutBox">
				<button @click="LoginOut">退出</button>
			</view>

		</view>


		<!-- 退出登录拟态框 -->
		<u-modal style="z-index: 9999999;" customClass="ModalPopupBox" :duration="100" contentPadStyle="40rpx 40rpx"
			:show="showLoginOut" :showConfirmButton="false" :zoom="false" width="480rpx" title="注销登录"
			content='是否要注销当前登录？'>
			<template slot="confirmButton">
				<view class="x-f" style="justify-content: space-around;">
					<u-button shape="circle"
						style="width: 44%;background-color: #f0f0f0;color: #4d4d4d;font-weight: 600;" text="取消"
						@click="CloseLoginOut" plain></u-button>
					<u-button shape="circle" style="width: 44%;background-color: #51d0d0;color: #fff;font-weight: 600;"
						text="确定" @click="SubmitLoginOut"></u-button>
				</view>
			</template>
		</u-modal>
	</view>
</template>

<script>
	// 更新APP用的
	// #ifdef APP-PLUS
	import MAPPUpdate from '@/uni_modules/mc-ui/components/m-app-update/js_sdk/appUpdate.js';
	// #endif
	export default {
		data() {
			return {
				showLoginOut: false, // 退出登录拟态框
				version: null, // 本机版本号
				fileSizeString: '',
			}
		},
		onReady() {
			// 需要在onReady中设置规则
			// this.$refs.baseForm.setRules(this.rules)
		},
		onLoad(option) {
			var that = this;
			// 获取本机版本号
			that.version = plus.runtime.version;

			this.formatSize();

		},
		methods: {
			openWebInBrowser(id) { // 打开外链
				// #ifdef APP-PLUS  
				switch (id) {
					case 1: // 用户协议
						plus.runtime.openURL('http://mes.hzyc.org.cn:20050/download/html/汇创云平台用户协议.html');
						break;
					case 2: // 隐私政策
						plus.runtime.openURL('http://mes.hzyc.org.cn:20050/download/html/汇创云平台隐私政策.html');
						break;
					default:
						break;
				}
				// #endif  
			},
			ToticketPage() { // 打开ticket目录下的文件
				uni.navigateTo({
					url: '/pages/mine/SettingBox/SetSafety',
					fail(error) {
						console.log(error)
					}
				})

			},
			formatSize() { // 获取缓存
				let that = this;
				plus.cache.calculate(function(size) {
					let sizeCache = parseInt(size);
					if (sizeCache == 0) {
						that.fileSizeString = "0B";
					} else if (sizeCache < 1024) {
						that.fileSizeString = sizeCache + "B";
					} else if (sizeCache < 1048576) {
						that.fileSizeString = (sizeCache / 1024).toFixed(2) + "KB";
					} else if (sizeCache < 1073741824) {
						that.fileSizeString = (sizeCache / 1048576).toFixed(2) + "MB";
					} else {
						that.fileSizeString = (sizeCache / 1073741824).toFixed(2) + "GB";
					}
				});
			},
			clear() { // 清除缓存
				let that = this
				uni.showModal({
					title: '清除缓存',
					content: '清除后会同时清理历史连接设备',
					confirmText: '立即清理',
					confirmColor: '#ff0707',
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							that.clearCache()

						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			// 清理缓存
			clearCache() {
				let that = this;
				let os = plus.os.name;
				if (os == 'Android') {
					let main = plus.android.runtimeMainActivity();
					let sdRoot = main.getCacheDir();
					let files = plus.android.invoke(sdRoot, "listFiles");
					let len = files.length;
					for (let i = 0; i < len; i++) {
						let filePath = '' + files[i]; // 没有找到合适的方法获取路径，这样写可以转成文件路径  
						plus.io.resolveLocalFileSystemURL(filePath, function(entry) {
							if (entry.isDirectory) {

								uni.clearStorageSync(); // 同步清理本地数据缓存。

								entry.removeRecursively(function(entry) { //递归删除其下的所有文件及子目录  
									uni.showToast({
										title: '缓存清理完成',
										duration: 2000
									});
									that.formatSize(); // 重新计算缓存  
									setTimeout(() => {
										// 直接重启APP 直接让vuex的数据初始化，很方便
										plus.runtime.restart();
										// uni.reLaunch({
										// 	url: '/pages/login/login',
										// });
									}, 2000)
								}, function(e) {
									console.log(e.message)
								});
							} else {
								entry.remove();
							}
						}, function(e) {
							console.log('文件路径读取失败')
						});
					}
				} else { // ios  
					plus.cache.clear(function() {
						uni.clearStorageSync(); // 同步清理本地数据缓存。

						uni.showToast({
							title: '缓存清理完成',
							duration: 2000
						});
						that.formatSize();
						setTimeout(() => {
							// 直接重启APP 直接让vuex的数据初始化，很方便
							plus.runtime.restart();
						}, 2000)
					});
				}
			},
			OpenManage() { // 打开应用信息
				uni.openAppAuthorizeSetting({
					success(res) {
						console.log(res)
					}
				});
			},
			LoginOut() {
				this.showLoginOut = true;
			},
			SubmitLoginOut() {
				uni.removeStorageSync('Automatic_Login')
				uni.reLaunch({
					url: '/pages/login/login',
				});
			},
			CloseLoginOut() {
				this.showLoginOut = false;
			},
			CloseSignaIRPopup() { // 关闭 SignaIR 弹窗，将按钮改为测试链接
				this.showSignaIR = false

				setTimeout(() => {
					this.IP_IS_True = false
				}, 300)
			},
			OpenSignaIRPopup() { // 打开 SignalR弹窗时，开机校验规则
				var that = this

				that.$refs.baseForm.setRules(that.rules)
			},
			IPTextFun(rule, value, data, callback) { // 自定义IP地址的自定义校验
				// 校验IP地址格式是否正确
				function validateIP(input) {
					var regex =
						/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/;
					return regex.test(input);
				}
				console.log(validateIP(value))
				if (!validateIP(value)) {
					callback('请输入正确的IP地址格式')
				} else {
					callback()
				}
			},
			BlurIPInput() { // 当 IP 输入框内容修改时，判断是否与之前的值相同，不相同，则重新展示测试连接
				var that = this
				if (that.IPModel.IPText != that.$store.getters.SignalR_IP) {
					that.IP_IS_True = false
				}
			},
			SubTextLine() { // 测试连接
				var that = this
				// 调用vuex中存储本地的方法
				that.$store.dispatch('receiceCode', that.IPModel.IPText);
				uni.showToast({
					title: '保存成功'
				});
				//that.$store.getters.SignalR_Connect.stop();
				that.showSignaIR = false;
			},
			SubBtn() { // 确认提交
				var that = this
				this.$refs.baseForm.validate().then(res => {
					console.log('success', res);
					that.SubLoading = true

					// 调用vuex中存储本地的方法
					that.$store.dispatch('receiceCode', that.IPModel.IPText)

					setTimeout(() => {
						that.SubLoading = false
						that.SignalR_Status = true // 连接状态
						that.$store.state.IPModel.SignalR_Status = true // 在 vuex中记录连接状态
						uni.showToast({
							title: '连接成功'
						})

						// 获取存储的
						console.log(that.$store.getters.SignalR_IP)

					}, 1000)

				}).catch(err => {
					console.log('err', err);
				})
			},
			GetUpdate() { // 检查更新
				var that = this;
				// UpdateSwitch
				// 改变值，开启检索 无更新提示
				that.$store.commit('ChangeAndSetStateData', {
					Name1: 'UpdateSwitch',
					data: true,
				});

				// #ifdef APP-PLUS
				MAPPUpdate();
				// #endif
			},
		}
	}
</script>

<style lang="scss">
	* {
		margin: 0;
		padding: 0;
		box-sizing: border-box;
	}

	.u-popup {
		flex: initial !important;

	}

	.ModalPopupBox {

		.u-popup__content {
			border-radius: 30rpx !important;
		}
	}

	.content {
		background-color: #f8f8f8;
		height: 100vh;
		display: flex;
		flex-direction: column;

		.CellBox {
			flex: 1;
			// padding-top: 10px;
			// overflow: auto;
			padding: 10px 15px;

			.u-cell-group {
				border-radius: 12px;
				box-shadow: 1px 1px 13px -13px #999;
				overflow: hidden;
			}

			.u-cell {
				background-color: #fff !important;
				position: relative;
			}

			// 给cell框下方加一根浅的线
			.u-cell::after {
				position: absolute;
				box-sizing: border-box;
				content: ' ';
				pointer-events: none;
				right: 16px;
				bottom: 0;
				left: 16px;
				border-bottom: 1px solid #ebedf0;
				-webkit-transform: scaleY(0.5);
				transform: scaleY(0.5);
			}

			// 去除最后一个cell的下划线
			& .u-cell:last-child::after {
				border-bottom: none !important;
			}
		}

		// 按钮的边框线在这里去除
		uni-button:after {
			border: none !important;
		}

		//  退出登录
		.LoginOutBox {
			width: 100%;
			// text-align: center !important;
			margin-top: 50px;

			button {
				width: 90%;
				margin: 0 auto;
				background-color: #d13c3c;
				border: none !important;
				color: #fff;
			}
		}


		//IP地址 
	}
</style>